<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Map的数据格式</title>
</head>
<body>
  <div id="myDiv"></div>
  <script>
    /*
    * 含义和基本用法
    */
    const data = {}
    const element = document.getElementById('myDiv')
    data[element] = '测试'
    // console.log(data) // {[object HTMLDivElement]: "测试"}
    // console.log(data[element]) // 测试
    // console.log(data['[object HTMLDivElement]']) //测试
    // 使用Element
    /*
    * 由于对象只接收字符串作为键名,因此ES6引入Map数据结构,比Object更加完善
    */
    // 接收对象
    const m = new Map()
    const o = {p: 'hello world'}
    m.set(o, 'content')
    // console.log(m)
    // console.log(m.get(o)) // content
    // console.log(m.has(o)) // true
    // console.log(m.delete(o))// true
    // console.log(m.has(o)) //false

    // 接收数组
    const items = [
      ['name', '张三'],
      ['titel', 'Author']
    ]
    const map = new Map()
    items.forEach(
      ([key, value]) => {
        console.log(key, value)
        map.set(key, value)
      }
    )
    console.log(map)
    console.log(typeof(null))
  </script>
</body>
</html>